import React, { Component } from 'react'
import { NavBar, Button, Toast } from 'antd-mobile'
import "./Detail.less"
import { reqCartadd, reqGetgoodsinfo } from '../../http/api'
import Item from 'antd-mobile/lib/popover/Item'
export default class Detail extends Component {
    constructor() {
        super()
        console.log(this.props);
        // 初始化数据
        this.state = {
            goodsinfo: {}
        }
    }
    componentDidMount() {
        let { match: { params: { id } } } = this.props;
        reqGetgoodsinfo({ id: id }).then(res => {
            if (res.data.code == 200) {
                console.log(res);
                this.setState({
                    goodsinfo: res.data.list ? res.data.list[0] : {}
                })
            }
        })



    }
    add() {
        // 1.从本地存储取出uid
        let uid = JSON.parse(sessionStorage.getItem("user")).uid
        // 2.取id 和type
        let { match: { params: { id } } } = this.props
        console.log(id);
        reqCartadd({ uid, goodsid: id, type: 1, num: 1 }).then(res => {
            if (res.data.code === 200) {
                Toast.success(res.data.msg, 1)
            }
        })
    }
    render() {
        let { goodsinfo } = this.state
        console.log(this.props);
        return (
            <div className="home">
                <NavBar>详情</NavBar>
                {/* 渲染数据 */}

                <div>
                    <img src={goodsinfo.img} alt="" />
                    <p>商品名称： {goodsinfo.goodsname}</p>
                    <p>商品价格：{goodsinfo.market_price}</p>
                    <Button onClick={() => this.props.history.push('/index/shop')}>购物车</Button>
                    <Button onClick={() => this.add()}>加入购物车</Button>
                </div>


            </div>
        )
    }
}
